.command-list-popover--gitlab {
    // The navbar has z-index 1000
    z-index: 1001 !important;
}

.btn-icon--gitlab {
    img {
        // Gitlab applies this to svgs,
        // need to apply it to imgs for consistency too
        position: relative;
        top: 2px;
        vertical-align: baseline;

        // Replicate svg color hover effect
        opacity: 0.6;
        &:hover {
            opacity: 1;
        }
    }
}

.hover-overlay--gitlab {
    border-color: #e5e5e5;

    // Override Gitlab's default styles
    pre,
    code {
        padding: 0;
        border: none;
        background: none;
        color: inherit;
    }

    // highlight.js styles

    .hljs {
        display: block;
        overflow-x: auto;
        padding: 0.5em;
        color: #333333;
    }

    .hljs-comment,
    .hljs-quote {
        color: #999988;
    }

    .hljs-keyword,
    .hljs-selector-tag,
    .hljs-subst {
        color: inherit;
        font-weight: 600;
    }

    .hljs-number,
    .hljs-literal,
    .hljs-variable,
    .hljs-template-variable,
    .hljs-tag .hljs-attr {
        color: #008080;
    }

    .hljs-string,
    .hljs-doctag {
        color: #dd1144;
    }

    .hljs-title,
    .hljs-section,
    .hljs-selector-id {
        color: #333333;
    }

    .hljs-subst {
        font-weight: normal;
    }

    .hljs-type,
    .hljs-class .hljs-title {
        color: #445588;
    }

    .hljs-tag,
    .hljs-name,
    .hljs-attribute {
        color: #000080;
        font-weight: normal;
    }

    .hljs-regexp,
    .hljs-link {
        color: #009926;
    }

    .hljs-symbol,
    .hljs-bullet {
        color: #990073;
    }

    .hljs-built_in,
    .hljs-builtin-name {
        color: #0086b3;
    }

    .hljs-meta {
        color: #999999;
        font-weight: bold;
    }

    .hljs-deletion {
        background: #ffdddd;
    }

    .hljs-addition {
        background: #ddffdd;
    }

    .hljs-emphasis {
        font-style: italic;
    }

    .hljs-strong {
        font-weight: bold;
    }
}

.code-view-toolbar--gitlab {
    display: flex;

    // Same style as for Gitlab's svg icons
    img {
        vertical-align: baseline;
    }
    .btn img {
        height: 15px;
        width: 15px;
        position: relative;
        top: 2px;
    }
}
